<docs>
  ## 消息弹出框组件
  ## props
  * message 提示内容
  * btnText 按钮文案
</docs>
<template>
  <div :class="`weui-cell weui-cell_access data-picker1 ${valid === status.REJECTED ? 'weui-cell_warn' : ''}`"
   >
    <div class="weui-cell__hd">
      <p class="weui-label">{{label}}</p>
    </div>
    <!-- <div class="text"><inlineCalendar @switch="onChange"/></div> -->
    <div class="weui-cell__ft text" @click="selectDate('single')">{{labelName || value}}</div>
    <calendar :show.sync="show" :mode="mode" @switch="onChange" ref="calendar"
    :minDate="18900601" :maxDate="18900601"/>
  </div>
</template>
<script>
import { mixinValid } from 'common/mixins/mixins';
import dayjs from 'dayjs';
export default {
  name: 'data-picker1',
  props: {
    label: String,
    prop: String,
    value: String,
    rules: Object,
  },
  mixins: [mixinValid],
  data() {
    return {
      visible: false,
      show: false,
      labelName: '',
      mode: 'single',
    };
  },
  methods: {
    selectDate(mode) {
      this.show = true;
      this.mode = mode;
      this.date = '';
    },
    onChange(date) {
      if (date.month < 10) {
        this.date = date.year + '0' +  date.month;
      } else {
        this.date = date.year + '' +  date.month;
      }
      // if (this.mode === 'single') {
      //   this.date = date.format('YYYYMM');
      // } else {
      //   this.date = JSON.stringify(date.map((item) => item.format('YYYY-MM-DD')));
      // }
      // this.$emit('input', item.pop().dmid);
      this.labelName = this.date;
      this.$emit('input', this.date);
      // 选定值重置校验
      this.resetValid();
      // this.show = false;
    },

  }
};
</script>
<style scoped lang="scss">
@import '~common/scss/var.scss';
.weui-label {
  @include label;
}
.text {
  text-align: left;
  flex: 1 1 auto;
  height: 60px;
  color: #000;
  font-size: 14px;
  overflow: hidden;
  @include input-text;
}

</style>
